<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License

Name       : Temperate 
Description: A two-column, fixed-width design with dark color scheme.
Version    : 1.0
Released   : 20121205

-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="keywords" content="" />
<meta name="description" content="" />
<!-- <meta http-equiv="refresh" content="30;url=index.html" /> -->
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>My Tracker</title>
<link href='http://fonts.googleapis.com/css?family=Oswald:400,300'
	rel='stylesheet' type='text/css' />
<link href='http://fonts.googleapis.com/css?family=Abel|Satisfy'
	rel='stylesheet' type='text/css' />
<link href="../css/default.css" rel="stylesheet" type="text/css"
	media="all" />
<link rel="stylesheet" href="../css/nivo-slider.css" type="text/css"
	media="screen" />
<link rel="stylesheet" href="../css/slidestyle.css" type="text/css"
	media="screen" />
<link rel="stylesheet" href="../css/themes/default/default.css"
	type="text/css" media="screen" />
<link href="../css/iphone.css" media="mobile" rel="stylesheet"
	type="text/css" />
<!--[if IE 6]>
<link href="default_ie6.css" rel="stylesheet" type="text/css" />
<![endif]-->
<!-- For google map api and style -->
<script
	src="http://maps.googleapis.com/maps/api/js?key=AIzaSyAR33uUSrW-Nc3NWqPUZV30Anh1DOS9oto&sensor=false"
	type="text/javascript"></script>
<script
	src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript"
	src="http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerwithlabel/1.1.5/src/markerwithlabel_packed.js">
	
</script>

<style type="text/css">
#loginfield {
	background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0.47,
		#DCEFF2), color-stop(0.16, #0076D1), color-stop(0.87, #0076D1));
	width: 650px;
	border: 1px solid #0076D1;
	-moz-border-radius: 15px;
	border-radius: 15px;
	
	padding: 10px;
	margin-left: 28%;
	-webkit-box-shadow: 9px 2px 30px rgba(70, 179, 255, 0.87);
	-moz-box-shadow: 9px 2px 30px rgba(70, 179, 255, 0.87);
	box-shadow: 9px 2px 30px rgba(70, 179, 255, 0.87);
}

#logintable {
	-moz-border-radius: 15px;
	border-radius: 15px;
	border: 3px solid #0078D1;
	padding: 20px;
	background-color: white;

 -webkit-box-shadow: 9px 2px 30px rgba(70, 179, 255, 0.87);
	-moz-box-shadow: 9px 2px 30px rgba(70, 179, 255, 0.87);
	box-shadow: 9px 2px 30px rgba(70, 179, 255, 0.87);
}

#contentmoving {
	margin-left: 16%;
	margin-top: 2%;
}

tr,td {
	padding: 6px;
}

span.login {
	font-size: 3em;
	color: #000099;
	font-variant: small-caps;
	font-family: Comic Sans MS;
	font-weight: bold;
	margin-top:3%;
	
}

img.middle {margin-top:-3%;}

.field {
	color: #0000CD;
	font-size: 18px;
	text-align: right;
}
</style>



<!-- to navigate to phone page when using mobile -->
<script type="text/javascript">
	if ((navigator.userAgent.match(/iPhone/i))
			|| (navigator.userAgent.match(/iPad/i))
			|| (navigator.userAgent.match(/iPod/i))
			|| (navigator.userAgent.match(/android/gi))
			|| (navigator.userAgent.match(/Windows Phone/i))) {
		location.replace("phonelogin.html");
	}
</script>

<script type="text/javascript" src="../jquery.nivo.slider.js"></script>
<script type="text/javascript">
	$(window).load(function() {
		$('#slider').nivoSlider();
	});
</script>

</head>
<body>
	<form method="post" action="login">
		<div id="wrapper">
			<div id="header-wrapper">
				<div id="header" style="backgound-color: #0078D1;">
					<div id="logo">
						<h1>
							<a href="#">Omni-Health</a>
						</h1>
						<!-- <p>Pte Ltd</p> -->
					</div>

				</div>
			</div>


			<div id="page-wrapper">
				<div id="page">
					<div id="content">
						<div>
							<div id="loginfield">
								<div id="contentmoving">
									<table>
										<tr>
											<td><img src="images/login.png" alt="login" width="100" class="middle"
												height="100" style="vertical-align: middle;" /><span class="login">PLEASE LOGIN</span> </td>
										</tr>
									</table>
									<table id="logintable">
										<tr>
											<td class="field">Phone Number :</td>
											<td><input type="text" id="phoneno" name="phoneno"
												maxlength="8" size="20" style="font-size: 22px;" /></td>
										</tr>
										<tr>
											<td class="field">Passcode :</td>
											<td><input type="password" id="passcode" name="passcode"
												maxlength="4" size="20" style="font-size: 22px;" /></td>
										</tr>

										<tr>
											<td></td>
											<td><input type="submit" value="Submit"
												style="color: #0033CC; width: 100px; height: 40px; font-size: larger;" /></td>
										</tr>

									</table>
									<br /> <br />
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- <div id="footer-wrapper">
		<div id="footer-content" align="center" style="padding:35px 0px 0px 0px;">
			<div class="slider-wrapper theme-default" style="width:800px; height:260px;" >
            <div id="slider" class="nivoSlider">
                <img src="images/header.jpg" data-thumb="images/header.jpg" alt="" />
                <img src="images/1.jpg" data-thumb="images/1.jpg" alt=""/>
                <img src="images/2.jpg" data-thumb="images/2.jpg" alt="" data-transition="slideInLeft" />
                <img src="images/3.jpg" data-thumb="images/3.jpg" alt=""  />
				 <img src="images/4.jpg" data-thumb="images/4.jpg" alt="" />
				  <img src="images/5.jpg" data-thumb="images/5.jpg" alt=""  />
            </div>
        </div>

	</div>
</div> -->
		<div id="footer">
			<p>Copyright (c) by Nanyang Polytechnic.</p>
		</div>
	</form>

</body>
</html>
